<template>
    <div class="changephone">
        <hb-title-levels :list="list"
            pathType="child" />
        <hb-box :title="Lang.changeemail[lang][2]">
            <div class="Box">
                <div class="FormCon">
                    <div class="Label"
                        v-text="Lang.changeemail[lang][3]" />
                    <hb-input/>
                    <div class="Label"
                        v-text="Lang.changeemail[lang][4]" />
                    <hb-vercode formType="vercode"
                        back="vercode" />
                    <div class="signupbtn cur"
                        v-text="Lang.changeemail[lang][5]" />
                </div>
            </div>

        </hb-box>
    </div>
</template>

<script>
import Lang from './lang.js'
export default {
	name: 'changephone',
	data() {
		return {
			Lang,
			list: [{path: 'selfset', txt: '个人设置'}, {path: 'changephone', txt: '修改邮箱'}],
		}
	},
	computed: {
		lang() {
			return this.$store.state.setting.lang
		},
	},
	methods: {
		e_back_() {
			this.$router.push('/selfset')
		},
	},
}
</script>

<style scoped>
.hbTitle {
	margin-bottom: 20px;
}
.Box {
	display: flex;
	justify-content: center;
}
.FormCon {
	width: 525px;
	/* height: 318px; */
}
.Label {
	margin-top: 30px;
	margin-bottom: 5px;
	color: #61688a;
	font-size: 12px;
}
.signupbtn {
	height: 48px;
	margin-top: 30px;
	margin-bottom: 40px;
	background-color: #7a98f7;
	border-radius: 4px;
	text-align: center;
	line-height: 48px;
	font-size: 16px;
	color: #fff;
}
.signupbtn:hover {
	background-color: #a0b6f9;
}
</style>
